class Tab{
		constructor(box){
			//属性
			this.parent=document.querySelector(box);
			this.aBtn=this.parent.querySelectorAll('input');
			this.aLi=this.parent.querySelectorAll('li');
			//初始化事件
			this.show();
		}
		show(){
			let _this=this;
			for(let i=0; i<this.aBtn.length;i++){
				this.aBtn[i].onclick=function(){
					_this.index=i;
					_this.fn(i);	
				};
			}		
		}
		fn(i){
			for(var j=0;j<this.aLi.length;j++){
				this.aBtn[j].className='';
				this.aLi[j].className='';
			}
			this.aLi[i].className='show';
			this.aBtn[i].className='active';		
		}
	}
	
	class AutoPlayTab extends Tab{
		constructor(str){
			//继承属性
			super(str);
			this.autoFn();
			this.index=0;
		}
		autoFn(){
			var _this=this;
			setInterval(function(){
					_this.index++
					if(_this.index==_this.aBtn.length){	
						_this.index=0;								
					}
					_this.fn(_this.index);
			},1000);	
		}
	}
	
		
	window.onload=function(){
			new AutoPlayTab('#box');
	}